<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>研究报告</title>
    <link href="http://cdn.bootcss.com/normalize/7.0.0/normalize.min.css" rel="stylesheet">
    <link rel="stylesheet" href="public/lib/layer/css/layui.css">
    <link rel="stylesheet" href="public/css/public.css">
    <link rel="stylesheet" href="public/css/payment.css">
    <style>

    </style>
</head>

<body>
    <div class="header">
        <div class="nav-contact">
            <div class="row">
                <ul class="address"></ul>
                <div class="logo">
                    <a href="index.html">
                        <img src="public/images/sdk_logo.jpg" alt="">
                    </a>
                </div>
            </div>
        </div>
        <div class="row nav-menu">
            <div class="inline-block menu"></div>
            <div class="inline-block tool-side">
                <!-- <input class="search-bar hide" type="text"><span class="inline-block search-btn"></span> -->
            </div>
        </div>
    </div>
    <div class="contact-body">
        <!-- 内容引导 -->
        <div class="content-boot">
            <div class="row">
                <div class="content-title"><img src="public/images/sdk_content_boot.png" alt=""></div>
                <div class="content-explain" id="J_content-explain"></div>
            </div>
        </div>
        <!-- 高级教师 -->
        <div class="senior">
            <div class="row">
                <div class="content-title"><img src="public/images/sdk_gj.png" alt=""></div>
                <div class="J_teacherList_box" data-type="高级实战研究师">
			        <div class="teacher-wrap J_teacherList"></div>
        			<div class="load-more J_load_more hide">加载更多&gt;&gt;</div>
                </div>
            </div>
        </div>
        <!-- 中级教师 -->
        <div class="introduce">
            <div class="row">
                <div class="content-title"><img src="public/images/sdk_zj.png" alt=""></div>
                <div class="J_teacherList_box" data-type="中级实战研究师">
			        <div class="teacher-wrap J_teacherList"></div>
        			<div class="load-more J_load_more hide">加载更多&gt;&gt;</div>
                </div>
            </div>
        </div>
        <!-- 初级教师 -->
        <div class="junior">
            <div class="row">
                <div class="content-title"><img src="public/images/sdk_jt.png" alt=""></div>
                <div class="J_teacherList_box" data-type="初级实战研究师">
			        <div class="teacher-wrap J_teacherList"></div>
        			<div class="load-more J_load_more hide">加载更多&gt;&gt;</div>
                </div>
            </div>
        </div>
        <!-- 预约教师 -->
        <div class="appointment"></div>
    </div>
    <!-- 页脚 -->
    <div class="footer"></div>
    <!-- 老师资料 -->
    <div class="teacher-infos" id="teacherInfoLayer">
        <div class="teacherInfo-layer-head">老师资料</div>
        <div class="teacherInfo-layer-body" id="J_teacher_info"></div>
    </div>
    <script id="J_teacher_tpl" type="text/html">
        {{# d.list.forEach(function(val,index){ }}
        <div class="list-child">
            <div class="left-info">
                <div class="teacher-portrait"><img src="{{G.defaultAvator}}" data-lazyload-img="{{G.uploadurl}}/avator/{{val.userId}}.png" class="avator"></div>
                <p class="teacher-name">{{val.base.aliasName?val.base.aliasName:val.base.name}}</p>
                <p class="mar-top">打赏人数</p>
                <p class="font-red">{{val.extend.exceptionalNumber}}</p>
                <p class="mar-top">人气指数</p>
                <p class="font-red">{{val.extend.sentiment}}</p>
                <i class="hots"></i>
            </div>
            <div class="right-info">
                <div class="tips">前5期正确率：
                    <p>{{formatVal(val.correct5)}}%</p>
                </div>
                <div class="tips">前1期报告战绩:
                    <p>{{formatVal(val.correct1)}}%</p>
                </div>
                <div class="plate">
                    <p>本期研究板块：</p>
                    {{formatVal(val.extend.nowContent)}}
                </div>
            </div>
            <p class="reward" data-id="{{val.userId}}">立即打赏</p>
        </div>
        {{# }); }}
    </script>
    <script id="J_load_more" type="text/html">
    </script>
    <script id="J_teacher_info_tpl" type="text/html">
        <div class="teacher-layer-status">
            <div class="inline-block teacher-layer-icon">
                <img src="{{G.defaultAvator}}" alt="{{d.base.name}}" class="avator" data-lazyload-img="{{G.uploadurl}}/avator/{{d.userId}}.png">
            </div>
            <div class="inline-block">
                <div class="teacher-layer-name">{{d.base.aliasName?d.base.aliasName:d.base.name}}<span class="teacher-layer-label">{{d.base.teacherType}}/{{formatVal(d.base.educationalBackgroundValue)}}</span></div>
                <div class="teacher-layer-tag">
                 <!--    <span class="tag-span">证券从业资格证</span>
                    <span class="tag-span">本科学历</span>
                    <span class="tag-span">从业十年</span>
                    <span class="tag-span">老司机</span> -->
                </div>
            </div>
            <div class="inline-block teacher-layer-score">
                <p>前5期战绩：<span class="correct correct1">{{formatVal(d.correct5)}}%</span></p>
                <p>上期战绩：<span class="correct correct5">{{formatVal(d.correct1)}}%</span></p>
            </div>
        </div>
        <div class="teacher-layer-info">
            <ul>
                <li>年龄：{{formatVal(d.user.age)}}</li>
                <li>关注人数：{{d.extend.attentionNumber}}</li>
                <li>累计发表报告：{{d.extend.contributeNumber}}篇</li>
                <li>性别：{{genderShow(d.user.gender)}}</li>
                <li>从业时间：{{d.base.jobTime ? new Date(d.base.jobTime).format("YYYY-mm") : "-"}}</li>
                <li>累计获得打赏：{{d.extend.exceptionalMoney}}元</li>
            </ul>
            {{# if (G.getCookie("sdk_user_type") == "USER" && G.getCookie("sdk_user_id")) {}}
                <input type="button" class="teacher-layer-focus {{# if(!d.attentioned){ }}hide{{# } }}" id="J_off_attention" data-teacherid="{{d.userId}}" value="取消关注"> 
                <input type="button" class="teacher-layer-focus {{# if(d.attentioned){ }}hide{{# } }}" id="J_attention" data-teacherid="{{d.userId}}" value="+ 关注TA">
            {{# }; }}
        </div>
        <div class="recent-reports">
            <h2>最近发表的报告：</h2>
            <ul class="teacher-layer-reports" id="J_recent_report"></ul>
        </div>
        <div class="recommend-reports">
            <h2>精品推荐：</h2>
            <ul class="teacher-layer-reports-recommend" id="J_recommend_report"></ul>
        </div>
    </script>
    <script id="J_reports_tpl" type="text/html">
        {{# if(d.length){ }}
            {{# d.forEach(function(val,index){ }}
            <li class="product-list">
                <p class="report-time" title="{{val.title}}">{{val.title}}</p>
                <p>发布时间：</p>
                <p class="tac">{{new Date(val.createTime).format('YYYY-MM-DD')}}</p>
                <p class="tac">下载量：<i>{{val.downloadNumber}}</i></p>
                {{# if (val.free) { }}
                    <a class="report-download down-free" data-id="{{val.productId}}">免费下载</a>
                {{# } else if (val.payed) { }}
                    <a class="report-download down-free" data-id="{{val.productId}}">下载</a>
                {{# } else { }}
                    <div class="report-download J_buy_product" data-id="{{val.productId}}">打赏{{val.promotionsPrice}}</div>
                {{# } }}
            </li>
            {{# }); }}
        {{# }else{ }}
            <li class="tac"><img src="public/images/sdk_no_content.png" alt="暂无内容"></li>
        {{# }; }}
    </script>  
    <script src="public/lib/layer/layui.all.js"></script>
    <script src="public/js/G.js"></script>
    <script src="public/js/user.js"></script>
    <script src="public/js/product.js"></script>
    <script src="public/js/productOrder.js"></script>
    <script src="public/js/rechargeApi.js"></script>
    <script src="public/js/rechargeOrder.js"></script>
    <script src="public/js/reward.js"></script>
    <script src="public/js/teacher.js"></script>
    <script src="public/js/attention.js"></script>
    <script src="public/js/public.js"></script>
    <script src="http://cdn.bootcss.com/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
    <script>
    contentGuideApi.getOne("研究报告", function(data) {
        var html = "";
        for (var i = 0; i < data.length; i++) {
            var value = data[i].value;
            html += (i + 1) + "、" + value + "</br>";
        }
        $("#J_content-explain").html(html);
    })
    $(document).on("click", "#J_attention", function() {//关注
        var id = $(this).attr("data-teacherid");
        attentionApi.put(id, function() {
            $("#J_attention").addClass("hide");
            $("#J_off_attention").removeClass("hide");
            layer.msg("关注成功")
        })
    }).on('click','#J_off_attention',function(){//取消关注
        var id = $(this).attr("data-teacherid");
        attentionApi.delete(id,function(){
            $("#J_attention").removeClass("hide");
            $("#J_off_attention").addClass("hide");
            layer.msg('取消关注成功')
        })
    }).on("click", ".J_buy_product", function() {//点击支付需要根据id查询一次产品 然后调用openPayLayer支付弹窗，复制以下代码即可
        var id = $(this).attr("data-id");
        openPayLayer(id,'打赏已取消')
    }).on("click", ".J_load_more", function(){//加载更多
        var obj = $(this);
        var pageId = +obj.attr("data-pageId");
        var id = pageId ? pageId : 1;
        var type = obj.attr("data-type");
        
        loadTeacherListData(type, id + 1);
    }).on('click', '.reward', function() {
        var userId = $(this).data('id');
        teacherLayer(userId)
    })
    
    var boxs = $(".J_teacherList_box");
    for (var i = 0; i < boxs.length; i++) {
        var box = $(boxs[i]);
        var type = box.attr("data-type");
        loadTeacherListData(type, 1);
    }
    
    function loadTeacherListData(type, pageId) {
        var id = +pageId;
        var boxObj = $(".J_teacherList_box[data-type='" + type + "']");
        var listObj = boxObj.find(".J_teacherList:first");
        var loadMoreObj = boxObj.find(".J_load_more:first");
        
        loadMoreObj.attr("data-type", type);
        var loading = layer.load(1)
        teacher.getList({
            teacherType: type,
            pageId: id ? id : 1,
            pageSize: 8
        }, function(data) {
            layer.close(loading)
            laytpl($('#J_teacher_tpl').html()).render(data, function(html) {
                listObj.append(html)
            })
            var loadCount = pageId * 8;
            loadMoreObj.attr("data-pageId", id);
            if (data.count > loadCount) {
                loadMoreObj.removeClass("hide");
            } else {
                loadMoreObj.addClass("hide");
            }
            lazyload()
        })
    }

    //获取某个老师的信息
    function teacherLayer(userId, status) {
        layer.load(1)
        teacher.findOne(userId, {}, function(data) {
            laytpl($('#J_teacher_info_tpl').html()).render(data, function(html) {
                $('#J_teacher_info').html(html)
            })
            lazyload()
            reports(userId, '#J_recent_report', false);
            reports(userId, '#J_recommend_report', true);
            layer.closeAll()
            layer.open({
                area: ['800px', '760px'],
                title: false,
                closeBtn: 0,
                shadeClose: true,
                type: 1,
                scrollbar: false,
                content: $('#teacherInfoLayer')
            })
        })
    }
    //获取老师报告
    function reports(userId, dom, quintessence) {
        product.getList({
            teacherId: userId,
            pageSize: 5,
            quintessence: quintessence
        }, function(data) {
            laytpl($('#J_reports_tpl').html()).render(data.list, function(list) {
                $(dom).html(list)
            })
        })
    }

    
    </script>
</body>

</html>
